import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:gourmet/entity/discounts_activity.dart';
import 'package:gourmet/entity/merchant_service.dart';
import 'package:gourmet/utils/colors.dart';
import 'package:gourmet/utils/radian.dart';
import 'package:gourmet/utils/styles.dart';
import 'package:syncfusion_flutter_sliders/sliders.dart';

class ScreenConditionController extends GetxController {
  List<Rx<DiscountsActivity>> activity = [];

  List<Rx<MerchantService>> service = [];

  Rx<SfRangeValues> values = Rx(const SfRangeValues(0, 100));

  @override
  void onInit() {
    activity.add(Rx(DiscountsActivity(name: '平台补贴')));
    activity.add(Rx(DiscountsActivity(name: '满返代金券')));
    activity.add(Rx(DiscountsActivity(name: '满赠活动')));
    activity.add(Rx(DiscountsActivity(name: '特价商品')));
    activity.add(Rx(DiscountsActivity(name: '首单立减')));
    activity.add(Rx(DiscountsActivity(name: '进店领券')));
    activity.add(Rx(DiscountsActivity(name: '减配送费')));
    activity.add(Rx(DiscountsActivity(name: '店铺满减')));

    service.add(Rx(MerchantService(name: '平台转送')));
    service.add(Rx(MerchantService(name: '到店自取')));
    service.add(Rx(MerchantService(name: '新店铺')));
    service.add(Rx(MerchantService(name: '开发票')));
    service.add(Rx(MerchantService(name: '0价起送')));
    service.add(Rx(MerchantService(name: '品牌商家')));
    super.onInit();
  }
}

class ScreenConditionView extends GetView<ScreenConditionController> {
  const ScreenConditionView({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      child: Column(
        children: [
          Container(
            padding: const EdgeInsets.only(left: 15, right: 15, top: 15),
            child: Column(
              children: [
                Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '优惠活动',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color7979,
                        fontSize: StylesUtils.fontSize13),
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(vertical: 15),
                  alignment: Alignment.centerLeft,
                  child: Wrap(
                    spacing: 5,
                    runSpacing: 10,
                    children: controller.activity.map((e) {
                      return Obx(() {
                        return GestureDetector(
                          onTap: () {
                            e.update((v) {
                              v?.checked = !v.checked;
                            });
                          },
                          child: Container(
                            constraints: const BoxConstraints.expand(
                                width: 110, height: 30),
                            alignment: Alignment.center,
                            decoration: BoxDecoration(
                                color: e.value.checked
                                    ? ColorsUtils.rgba(250, 245, 245, 1)
                                    : ColorsUtils.parseColorFromHexString(
                                        ColorsUtils.colorF5f5),
                                borderRadius: BorderRadius.circular(2.r),
                                border: Border.all(
                                    color: ColorsUtils.rgba(244, 195, 186, 1),
                                    width: e.value.checked ? 1 : 0)),
                            child: Text(
                              e.value.name,
                              style: StylesUtils.customTextStyle(
                                  color: e.value.checked
                                      ? ColorsUtils.colorFf64
                                      : ColorsUtils.color7979),
                            ),
                          ),
                        );
                      });
                    }).toList(),
                  ),
                ),
                Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '商家服务',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color7979,
                        fontSize: StylesUtils.fontSize13),
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(vertical: 15),
                  alignment: Alignment.centerLeft,
                  child: Wrap(
                    spacing: 5,
                    runSpacing: 10,
                    crossAxisAlignment: WrapCrossAlignment.center,
                    alignment: WrapAlignment.start,
                    children: controller.service.map((e) {
                      return Obx(() {
                        return GestureDetector(
                          onTap: () {
                            e.update((v) {
                              v?.checked = !v.checked;
                            });
                          },
                          child: Container(
                            constraints: const BoxConstraints.expand(
                                width: 110, height: 30),
                            alignment: Alignment.center,
                            decoration: BoxDecoration(
                                color: e.value.checked
                                    ? ColorsUtils.rgba(250, 245, 245, 1)
                                    : ColorsUtils.parseColorFromHexString(
                                        ColorsUtils.colorF5f5),
                                borderRadius: BorderRadius.circular(2.r),
                                border: Border.all(
                                    color: ColorsUtils.rgba(244, 195, 186, 1),
                                    width: e.value.checked ? 1 : 0)),
                            child: Text(
                              e.value.name,
                              style: StylesUtils.customTextStyle(
                                  color: e.value.checked
                                      ? ColorsUtils.colorFf64
                                      : ColorsUtils.color7979),
                            ),
                          ),
                        );
                      });
                    }).toList(),
                  ),
                ),
                Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '人均价格筛选 (元)',
                    style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color7979,
                        fontSize: StylesUtils.fontSize13),
                  ),
                ),
                Obx(() => Padding(
                      padding: const EdgeInsets.symmetric(vertical: 10),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            '${controller.values.value.start}',
                            style: StylesUtils.customTextStyle(
                                color: ColorsUtils.colorFf64),
                          ),
                          Text(
                            '${controller.values.value.end}',
                            style: StylesUtils.customTextStyle(
                                color: ColorsUtils.colorFf64),
                          )
                        ],
                      ),
                    )),
                Obx(
                  () => SfRangeSlider(
                      min: 0,
                      max: 100,
                      activeColor: ColorsUtils.parseColorFromHexString(
                          ColorsUtils.colorFf64),
                      stepSize: 1,
                      values: controller.values.value,
                      onChanged: (SfRangeValues values) {
                        controller.values.value = values;
                      }),
                ),
              ],
            ),
          ),
          Container(
            padding: const EdgeInsets.only(top: 15),
            alignment: Alignment.center,
            child: SizedBox(
              height: 45,
              child: Row(
                children: [
                  Expanded(
                    child: GestureDetector(
                      onTap: () {
                        controller.values.value = controller.values.value
                            .copyWith(start: 0, end: 100);
                        for (var action in controller.service) {
                          action.update((s) => s?.checked = false);
                        }
                        for (var action in controller.activity) {
                          action.update((s) => s?.checked = false);
                        }
                      },
                      child: Container(
                        decoration: BoxDecoration(
                          color: ColorsUtils.parseColorFromHexString(
                              ColorsUtils.colorF5f5),
                        ),
                        alignment: Alignment.center,
                        child: Text(
                          '重置',
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color0000,
                              fontSize: StylesUtils.fontSize16),
                        ),
                      ),
                    ),
                  ),
                  Expanded(
                    child: GestureDetector(
                      onTap: Get.back,
                      child: Container(
                        decoration: BoxDecoration(
                          gradient: LinearGradient(
                            //linear-gradient(90deg, rgba(255, 153, 0, 1) 0%, rgba(255, 153, 0, 1) 0%, rgba(255, 100, 77, 1) 100%, rgba(255, 100, 77, 1) 100%)
                            colors: [
                              ColorsUtils.rgba(255, 153, 0, 1),
                              ColorsUtils.rgba(255, 153, 0, 1),
                              ColorsUtils.rgba(255, 100, 77, 1),
                              ColorsUtils.rgba(255, 100, 77, 1)
                            ],
                            stops: const [0, 0, 1.0, 1.0],
                            transform: GradientRotation(
                              RadianUtils.angleToRadian(90),
                            ),
                          ),
                        ),
                        alignment: Alignment.center,
                        child: Text(
                          '筛选',
                          style: StylesUtils.customTextStyle(
                              fontSize: StylesUtils.fontSize16),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          )
        ],
      ),
    );
  }
}
